/** tipiX - TIme PIcture eXplorer
 * 
 * Copyright (c) 2013 TIPIX <adalca@mit.edu>
 *
 * tipiX is licensed under the MIT License:
 * http://www.opensource.org/licenses/mit-license.php
 *
 * See LICENSE file for more information
 *
 * Author: Adrian V. Dalca, http://www.mit.edu/~adalca/
 */


@charset "utf-8";
/* CSS Document */

@import url(http://fonts.googleapis.com/css?family=Roboto:100,200,300,300italic,400,500);



body {
	font: 14px "Roboto",Helvetica,Helvetica Neue,Arial;	
	overflow:hidden;
	background-color:#111;
	#background-image: url(../images/bg_white2.jpg);
}

h1 {
	font: 36px "Roboto",Helvetica,Helvetica Neue,Arial;
	text-align:left;
	margin-bottom:0px;
	padding-bottom:0px;
	font-weight:300;
	margin-top:0px;
	color:#000;
	display:inline;
}

h2 {
	font: 20px "Roboto",Helvetica,Helvetica Neue,Arial;
	text-align:center;
	margin-top:0px;
	padding-top:0px;
	margin-bottom:10px;
	padding-bottom:0px;
	font-weight:300;
	color:#000;
}

h3 {
	font: 18px "Roboto",Helvetica,Helvetica Neue,Arial;
	text-align:left;
	font-weight:300;
	margin-top:10px;
}

a {
	text-decoration:none;
}

a:hover {
	color:#F90;
}

#main-container {
	margin: 0 auto;
	top:50%;
	left:50%;
	position:absolute;
	margin-left:-600px;
	margin-top:-450px;
	width:1200px;
	height:900px;
	background-color:#111;
	#box-shadow:0px 0px 250px 100px white;
	z-index:0;
}

#side-container {
	left:0px;
	width:200px;
	height:900px;
	float:left;
}

#right-container {
	left:0px;
	width:200px;
	height:900px;
	float:right;
}

#display-container {
	margin: 0 auto;
	top:50%;
	left:50%;
	margin-left:-600px;
	margin-top:-450px;
	position:relative;
	width:1200px;
	height:900px;
	text-align:center;
	float:left;
	background-image:url('http://www.mit.edu/~adalca/tipiX/images/logo.png');
	background-repeat:no-repeat;
	background-attachment:fixed;
	background-position:center;
	display:block;
}

#mainDisplay {
	width:1200px;
	height:900px;
	#box-shadow:0px 0px 50px 0px #DDD;
	z-index:100;
}


#left-container {
	width:200px;
	text-align:center;
	height:600px;
}



#imgnr {
	margin:auto;
	width:190px;
	height:20px;
	margin:5px;
}

#time  {
	margin:auto;
	width:190px;
	height:20px;
	margin:5px;
}
#debug {
	margin:auto;
	width:190px;
	height:50px;
	margin:5px;
}


/* Loading Matrix */
#loadMatrix {
	width:190px;
	height:90px;
	margin:5px;
}

.loadBox {
	height:10px;
/*	float:left;*/
}



/* Preview Matrix */
#previewMatrix {
	margin:auto;
	width:190px;
	height:90px;
	margin:5px;
}

#previewMatrixLink {
	margin:auto;
	width:190px;
	height:20px;
	margin:5px;
}

.previewBox {
	height:10px;
/*	float:left;*/
}



#loadingCanvas {
	background-color:#063;	
}
